<template>
  <div class="about">
      <p>{{num}}</p>
      <p>{{number}}</p>
      <button @click="add">++</button>
  </div>
</template>
<script>
import { ref,reactive,toRefs } from 'vue';
export default {
  setup(props) { // 组合api  注意：setup 没有this
    
    // console.log(this);
    // 处理数字加加业务的
    var num = ref(0); // 视图和数据同步更新 ref 声明 简单的数据类型，string,number
    // const add = () => {
    //    num.value++
    // }

    const data = reactive({ // 一般用来声明引用数据类型
      number: 12
    })
    // function add () {
    //   num.value++
    // }
     
     const add = () => {
       data.number++
     }


    // rgerg

    return { // 需要绑定的数据和方法必须返回出去
      num,
      add,
      ...toRefs(data) // toRefs 展开数据
    }
  }
}


 let obj = {
   name: '张三'
 }
let obj1 = JSON.parse(JSON.stringify(obj));

obj1.name = '李四';

console.log(obj1);
console.log(obj);
// git 联系
</script>
